<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <title>{$title}</title>
    <css href="__PUBLIC__/css/reset.css"/>
    <css href="__PUBLIC__/css/style.css"/>
    <css href="__PUBLIC__/css/bootstrap.min.css"/>
    <css href="__PUBLIC__/css/bootstrapValidator.css"/>
    <css href="__PUBLIC__/css/kreg.css"/>
    <js href="__PUBLIC__/js/Jquery/jquery-1.js"/>
    <js href="__PUBLIC__/js/bootstrapValidator.js"/>
    <script language="JavaScript">
        $(document).ready(function(){
            $(" #realname").change(function(){
                var realname=document.getElementById('realname');
                //姓名正则
                var reg_realname=/^[\u4E00-\u9FA5]{2,7}$|^[\u4E00-\u9FA5]{2,5}(?:·[\u4E00-\u9FA5]{2,5})$|^[a-zA-Z]{1,30}$/;
                var res_realname=reg_realname.test(realname.value);
                if(realname.value=="" || !res_realname){
                    document.getElementById("attr1").innerHTML = "×姓名错误";
                    realname.focus();
                    return false;
                }else{
                    document.getElementById("attr1").innerHTML = "真实姓名";
                }
            });
            $(" #qq").change(function(){
                var qq=document.getElementById('qq');
                //qq正则
                var reg_qq=/^[1-9]{1}[0-9]{4,10}$/;
                var res_qq=reg_qq.test(qq.value);
                if(qq.value=="" || !res_qq){
                    document.getElementById("attr2").innerHTML = "×QQ错误";
                    qq.focus();
                    return false;
                }else{
                    document.getElementById("attr2").innerHTML = "QQ";
                }
            });
            $(" #address").change(function(){
                var address=document.getElementById('address');
                //详细地址正则
                var reg_address=/^[\u4E00-\u9FFFa-zA-Z\d-]+$/;
                var res_address=reg_address.test(address.value);
                if(address.value=="" || !res_address){
                    document.getElementById("attr3").innerHTML = "×地址错误";
                    address.focus();
                    return false;
                }else{
                    document.getElementById("attr3").innerHTML = "详细住址";
                }
            });
            $(" #pay_account").change(function(){
                var payAccount=document.getElementById('pay_account');
                //银行账号正则
                var reg_payAccount=/^\d{16}|\d{19}$/;
                var res_payAccount=reg_payAccount.test(payAccount.value);
                if(payAccount.value=="" || !res_payAccount){
                    document.getElementById("attr4").innerHTML = "×卡号错误";
                    payAccount.focus();
                    return false;
                }else{
                    document.getElementById("attr4").innerHTML = "银行账号";
                }
            });
            $(" #idCard").change(function(){
                var idCard=document.getElementById('idCard');
                //身份证号正则
                var reg_idCard=/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
                var res_idCard=reg_idCard.test(idCard.value);
                if(idCard.value=="" || !res_idCard){
                    document.getElementById("attr5").innerHTML = "×身份证错误";
                    idCard.focus();
                    return false;
                }else{
                    document.getElementById("attr5").innerHTML = "身份证号码";
                }
            });
        });
        //验证上传数据的合法性
        function audite(){
            var realname=document.getElementById('realname');
            var qq=document.getElementById('qq');
            var address=document.getElementById('address');
            var payAccount=document.getElementById('pay_account');
            var idCard=document.getElementById('idCard');
            //姓名正则
            var reg_realname=/^[\u4E00-\u9FA5]{2,7}$|^[\u4E00-\u9FA5]{2,5}(?:·[\u4E00-\u9FA5]{2,5})$|^[a-zA-Z]{1,30}$/;
            var res_realname=reg_realname.test(realname.value);
            if(realname.value=="" || !res_realname){
                document.getElementById("attr1").innerHTML = "×姓名错误";
                realname.focus();
                return false;
            }else{
                document.getElementById("attr1").innerHTML = "真实姓名";
            }
            //qq正则
            var reg_qq=/^[1-9]{1}[0-9]{4,10}$/;
            var res_qq=reg_qq.test(qq.value);
            if(qq.value=="" || !res_qq){
                document.getElementById("attr2").innerHTML = "×QQ错误";
                qq.focus();
                return false;
            }else{
                document.getElementById("attr2").innerHTML = "QQ";
            }
            //详细地址正则
            var reg_address=/^[\u4E00-\u9FFFa-zA-Z\d-]+$/;
            var res_address=reg_address.test(address.value);
            if(address.value=="" || !res_address){
                document.getElementById("attr3").innerHTML = "×地址错误";
                address.focus();
                return false;
            }else{
                document.getElementById("attr3").innerHTML = "详细住址";
            }
            //银行账号正则
            var reg_payAccount=/^\d{16}|\d{19}$/;
            var res_payAccount=reg_payAccount.test(payAccount.value);
            if(payAccount.value=="" || !res_payAccount){
                document.getElementById("attr4").innerHTML = "×卡号错误";
                payAccount.focus();
                return false;
            }else{
                document.getElementById("attr4").innerHTML = "银行账号";
            }
            //身份证号正则
            var reg_idCard=/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
            var res_idCard=reg_idCard.test(idCard.value);
            if(idCard.value=="" || !res_idCard){
                document.getElementById("attr5").innerHTML = "×身份证错误";
                idCard.focus();
                return false;
            }else{
                document.getElementById("attr5").innerHTML = "身份证号码";
            }

        }
    </script>
</head>
<body>
<include file="./Application/Home/View/nav.html"/>
<!--------------------------------内容部分-------------------------------------->
<div class="container">

    <div class="row">
        <div class="col-lg-6">
            <img src="__PUBLIC__/images/LOGO.png" class="img-responsive"/>
        </div>
    </div>

    <div class="row" id="content">
            <div class="col-lg-12" id="content-title">
                <span>
                            <div style="float: left;">//////////////////////////////////////</div>
                            <label id="error_tps">店主注册</label>
                            <div style="float: right;">//////////////////////////////////////</div>
                        </span>
            </div>

        <section>
            <div class="col-lg-12" id="content-form">
                <form role="form" action="{:U('/kregCheck')}" novalidate="novalidate" id="kregister-form" method="post" enctype="multipart/form-data">
                    <div class="col-lg-6" id="form-input">
                        <div class="form-group has-feedback">
                            <label id="attr1" for="realname" class="col-sm-2 control-label">真实姓名</label>
                            <input type="text" data-bv-field="realname" name="realname" id="realname" class="form-control col-sm-10" required="required" placeholder="请输入您的真实姓名" maxlength="30" />
                        </div>

                        <div style="margin-left: 30px; font-size:20px;">
                            <div style="float: left;"><span style="color: red;">*</span><label>性别：</label></div>
                            <label style="cursor: pointer;"><input type="radio" name="gender" value="女" checked="true"/>女</label>
                            &nbsp;
                            &nbsp;
                            <label style="cursor: pointer;"><input type="radio" name="gender" value="男"/>男</label>
                        </div>

                        <div style="margin-left: 30px; font-size:20px;">
                            <span style="color: red;">*</span><label>年龄：</label>
                            <select style="width: 70px;" name="age" id="age">
                                <?php
                                for($i=18;$i<65;$i++){
                                    ?>
                                <option value="<?php echo $i;?>"><?php echo $i;?></option>
                                <?php
                                }
                                ?>
                            </select>
                        </div>

                        <div class="form-group has-feedback">
                            <label id="attr2" for="qq" class="col-sm-2 control-label">QQ</label>
                            <input type="text" data-bv-field="qq" name="qq" id="qq" class="form-control col-sm-10" required="required" maxlength="12" placeholder="请输入您的QQ号码"/>
                        </div>

                        <div class="form-group has-feedback">
                            <label id="attr3" for="address" class="col-sm-2 control-label">详细住址</label>
                            <input type="text" data-bv-field="address" name="address" id="address" class="form-control col-sm-10" required="required" placeholder="请输入您的详细住址" />
                        </div>

                        <div class="form-group has-feedback">
                            <label id="attr4" for="pay_account" class="col-sm-2 control-label">银行账号</label>
                            <input type="text" data-bv-field="pay_account" name="pay_account" id="pay_account" class="form-control col-sm-10" required="required" placeholder="请输入您的银行账号" />
                        </div>

                        <div class="form-group has-feedback">
                            <label id="attr5" for="idCard" class="col-sm-2 control-label">身份证号码</label>
                            <input type="text" data-bv-field="idCard" name="idCard" id="idCard" class="form-control col-sm-10" required="required" maxlength="18" placeholder="请输入您的身份证号码"/>
                        </div>

                        <div style="margin-left: 30px; font-size:20px; height: 140px;">
                            <div style="float: left;"><span style="color: red;">*</span><label>健康证：</label></div>
                            <div style="float:left;width: 150px; height: 130px; border: 1px solid #afafaf; margin-left: 60px;"></div>
                            <input type="file" name="photo" style="float: left;"/>
                        </div>

                    </div>

                    <div class="col-lg-6" id="form-img">
                        <div class="form-group">
                            <div style="margin-left: 30px; margin-top: 30px; font-size:20px; height: 150px;">
                                <div style="float: left;"><span style="color: red;">*</span><label>身份证正面照：</label></div>
                                <div style="float:left;width: 130px; height: 150px; border: 1px solid #afafaf; margin-left: 60px;"></div>
                                <input type="file" name="id_photo_front" style="float: left;"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <div style="margin-left: 30px; margin-top: 80px; font-size:20px; height: 150px;">
                                <div style="float: left;"><span style="color: red;">*</span><label>身份证背面照：</label></div>
                                <div style="float:left;width: 130px; height: 150px; border: 1px solid #afafaf; margin-left: 60px;"></div>
                                <input type="file" name="id_photo_back" style="float:left;"/>
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-12" id="form-button">
                        <div class="form-group">
                            <input type="submit" class="btn btn-default btn-lg active" value="提交审核"/>
                        </div>
                    </div>
                </form>
            </div>
        </section>
        <script type="text/javascript">
            $(document).ready(function () {
                // Generate a simple captcha
                function randomNumber(min, max) {
                    return Math.floor(Math.random() * (max - min + 1) + min);
                };
                $('#captchaOperation').html([randomNumber(1, 100), '+', randomNumber(1, 200), '='].join(' '));

                $('#kregister-form').bootstrapValidator({
                    //        live: 'disabled',
                    message: '输入的值不正确',
                    feedbackIcons: {
                        valid: 'glyphicon glyphicon-ok',
                        invalid: 'glyphicon glyphicon-remove',
                        validating: 'glyphicon glyphicon-refresh'
                    },
                    fields: {
                        realname: {
                            validators: {
                                notEmpty:{
                                    message:'真实姓名不能为空'
                                },
                                regexp:{
                                    regexp:/^[\u4E00-\u9FA5]{2,7}$|^[\u4E00-\u9FA5]{2,5}(?:·[\u4E00-\u9FA5]{2,5})$|^[a-zA-Z]{1,30}$/,
                                    message:'姓名格式不正确'
                                }
                            }
                        },
                        qq: {
                            validators: {
                                notEmpty:{
                                    message:'QQ不能为空'
                                },
                                regexp:{
                                    regexp:/^[1-9]{1}[0-9]{4,10}$/,
                                    message:'QQ格式不正确'
                                }
                            }
                        },
                        address: {
                            validators: {
                                notEmpty:{
                                    message:'详细地址不能为空'
                                },
                                regexp:{
                                    regexp:/^[\u4E00-\u9FFFa-zA-Z\d-]+$/,
                                    message:'地址格式不正确'
                                }
                            }
                        },
                        pay_account:{
                          validators:{
                              notEmpty:{
                                  message:'银行卡号不能为空'
                              },
                              regexp:{
                                  regexp:/^\d{16}|\d{19}$/,
                                  message:'银行卡号格式不正确'
                              }
                          }
                        },
                        idCard: {
                            validators: {
                                notEmpty:{
                                    message:'身份证不恩能够为空'
                                },
                                regexp:{
                                    regexp:/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/,
                                    message:'身份证格式不正确'
                                }
                            }
                        }

                    }
                });

                // Validate the form manually
                $('#validateBtn').click(function () {
                    $('#kregister-form').bootstrapValidator('validate');
                });

                $('#resetBtn').click(function () {
                    $('#kregister-form').data('bootstrapValidator').resetForm(true);
                });
            });
        </script>
    </div>
</div>
<!--	引入底部	-->
<include file="./Application/Home/View/footer.html"/>
</body>
</html>